<!-- 评价 -->
<template>
	<view class="content">
		<!-- 商家信息 -->
		<view class="notice">
			<view class="notice_card pr x-f">
				<view class="card_left">
					<image :src="seller_list.cover"></image>
				</view>
				<view class="card_middle">
					<view class="middle_name one-t">{{seller_list.name || ''}}</view>
					<view class="middle_place">{{seller_list.address || ''}}</view>
					<image src="/static/image/place.png" mode=""></image>
					<view class="middle_address one-t">{{seller_list.address || ''}}</view>
				</view>
			</view>
		</view>
		<!-- 评分 -->
		<view class="comment">
			<view class="star">
				<u-rate :count="count" v-model="value"></u-rate>
			</view>
			<view class="title tc">如果满意请给五星好评哟~</view>
			<view class="middle pr">
				<textarea 
					class="middle_span" 
					placeholder="商家怎么样？说说你的感受~" 
					v-model="desc" @input="descInput" maxlength="88">
				</textarea>
				<view class="middle_num pa">{{remnant}}/88</view>
			</view>
		</view>
		<view class="botton tc" @tap="submit">
			提交
		</view>
	</view>
</template>

<script>
	import { mapState } from 'vuex'
	export default {
		data() {
			return {
				btnTitle: '提交',                               // 提交按钮
				current: 0,									   // 下标
				desc: '',									   // 描述
				remnant:0,									   // 文字限制数量
				after_sale: this.imgUrl + 'after_sale-add.png',// 添加图片的图标
				count: 5,									   // 好评星星数量						
				value: 0,									   // 数值
				rule: {										   // 正则检验表单
					detail: {
						type: "form_data",
						rules: [{
							rule: /^s*$/,
							v_res: false,
							message: "内容不能为空",
						}],
					},
					star: {
						type: "form_data",
						rules: [{
							rule: /^s*$/,
							v_res: false,
							message: "记得打分哦！",
						}],
					},
				},
				obj: {											// 提交请求参数
					shop_id: '', 								// 商铺id
					member_id: 1,
					text: '',
					level: -1
				}
			}
		},
		computed: {
			...mapState({
				seller_list: state => state.sellers.sellerInfo,  // 商家信息
				user: state => state.user.user					 // 用户信息
			})
		},
		onLoad() {
			// 获取店铺id
			this.obj.shop_id= Number(this.$Route.query.id);
		},
		methods: {
			// 计算数字开始
			descInput() {
				let txtVal = this.desc.length
				this.remnant = txtVal
			},
			submit() {
				this.obj.text = String(this.desc)
				this.obj.level = this.value
				if(!this.obj.text.length) {
					this.$tools.toast('请输入评价内容')
					return;
				}
				this.$api('shopcomment',this.obj).then(res => {
					if(res.status) {
						this.$tools.toast('商家评价成功')
						setTimeout(() => {
							uni.navigateBack({
								delta: 1
							});
						},1000)
						this.$store.dispatch('sellers/get_comment',this.obj)
					}
				})
			},
			jump(path, params) {
			    this.$Router.back(1);
			},
		}
	}
</script>

<style lang="scss" scoped>
	@import './index.scss';
</style>

